<ion-header style="background: #040F22;">
  <div style="border-bottom: 1px solid #0b1a34;"><img class="logo_img" src="assets/img/logo.png" alt=""></div>
</ion-header>

<ion-content>
  <ion-refresher color="white" slot="fixed" (ionRefresh)="doRefresh($event)">
    <ion-refresher-content color="white"
      refreshingText="刷新中...">
    </ion-refresher-content>
  </ion-refresher>
  
  <!-- 轮播图 -->
  <div class="home_banner">
    <ion-slides class="slide2 w96" #slide2 [options]="slidesOpts" (ionSlideTouchEnd)="slideTouchEnd()">
      <ion-slide *ngFor="let item of bannerList;">
        <img [src]="item.imagePath" alt="" srcset="">
      </ion-slide>
    </ion-slides>
  </div>

  <!-- 公告 -->
  <div class="notice-box">
    <div class="notice w96">
      <span>
        <img src="assets/img/notice.png" alt="">
      </span>
      <div [routerLink]="['/list/notice']" routerLinkActive="router-link-active" >
        <ion-slides #slide1 (ionSlideTouchEnd)="slideTouchEnd()" [options]="slidesOpts1">
          <ion-slide *ngFor="let item of noticeList">
            <p>{{item.title}}</p>
          </ion-slide>
        </ion-slides>
      </div>
    </div>
  </div>

  <!-- file实时币价 -->
  <div class="file_price w96">
    <div class="flie_title df_ja">
      <img src="assets/img/huobi.png" alt="">
      <span>火币网实时币价</span>
    </div>
    <!-- fil -->
    <ul class="df_ja fil_ul" *ngIf="filecoin">
      <li>
        <img src="assets/img/file.png" alt="">
      </li>
      <li>
        <p>FIL <i>/USDT</i></p>
        <span>Huobi</span>
      </li>
      <li>
          <p>{{filecoin.close}}</p>
          <span>￥{{(filecoin.close*filecoin.usdtPriceCny).toFixed(2)}}</span>
      </li>
      <li>
        <img src="assets/img/bodong.png" alt="">
      </li>
      
      <li *ngIf="filecoin.sign;else templateName"><span>{{filecoin.sheng}}%</span></li>
      <ng-template #templateName><li><span style="background-color: #03AD90;">+{{filecoin.sheng}}%</span></li></ng-template>
    </ul>
    <!-- xch -->
    <ul class="df_ja xch_ul" *ngIf="filecoin">
      <li>
        <img src="assets/img/xch.png" alt="">
      </li>
      <li>
        <p>XCH <i>/USDT</i></p>
        <span>Huobi</span>
      </li>
      <li>
        <p>{{xchcoin.close}}</p>
        <span>￥{{(xchcoin.close*xchcoin.usdtPriceCny).toFixed(2)}}</span>
      </li>
      <li>
        <img src="assets/img/bodong.png" alt="">
      </li>
      
      <li *ngIf="xchcoin.sign;else templateName"><span>{{xchcoin.sheng}}%</span></li>
      <ng-template #templateName><li><span style="background-color: #03AD90;">+{{xchcoin.sheng}}%</span></li></ng-template>
    </ul>
  </div>

  <div class="my_ipfs w96">
    <div class="flie_title df_ja">
      <p>我的算力存储</p>
    </div>
    <ul class="df_a" *ngFor="let item of ipfsData;let i = index">
      <li>
        <img *ngIf="i == 0" src="assets/img/ipfs.png" alt="">
        <img *ngIf="i == 1" src="assets/img/chia.png" alt="">
        <img *ngIf="i == 2" src="assets/img/swarm.png" alt="">
      </li>
      <li>
        <P>{{item.storage}} <i>T</i></P>
        <span>我的存储</span>
      </li>
      <li>
        <P>{{item.totalCoin}} <i *ngIf="i !== 2">{{item.coinType}}</i></P>
        <span *ngIf="i !== 2">累计产币</span>
        <span *ngIf="i == 2">累计产票</span>
      </li>
      <li>
        <P>{{item.yieldRate}} <i *ngIf="i !== 2">{{item.coinType}}/T</i><i *ngIf="i == 2">张/节点</i></P>
        <span *ngIf="i !== 2">预计日产币</span>
        <span *ngIf="i == 2">预计日产票</span>
      </li>
    </ul>
  </div>

  <div class="w96 news p_bm5">
    <div class="h_title">
        <span>行业快讯</span>
        <div class="more" style="float: right;" [routerLink]="['/list/news']" routerLinkActive="router-link-active" >
          更多
          <ion-icon name="chevron-forward-outline"></ion-icon>
        </div>
    </div>

    <div class="news_list">
      <ul>
        <li *ngFor="let item of newsLsit">
           <!-- <div [routerLink]="['/newsdetail']" [queryParams]="{link:item.link}" routerLinkActive="router-link-active" > -->
          <a [href]="item.link">
            <p>{{item.title}}</p>
            <img-lazy-load [src]="item.imagePath"></img-lazy-load>
          </a>
        <!-- </div> -->
        </li>
      </ul>
      
    </div>

  </div>

  <app-lodding [falg]='show'></app-lodding>


</ion-content>
